<template>
    <div class="resultRow">
        {{ i18n("resultRows", "查询结果行数") }}
    </div>
    <a-radio-group style="margin-top: 10px" v-model:value="resultRow" @change="onChange">
        <div style="display: flex;align-items: center;">
            <a-radio value="all">{{ $ti18('rxList.all', '全部') }}</a-radio>
            <a-radio value="custom">
                <a-input-number style="width:60px;" v-model:value="resultRows" :min="0"></a-input-number>
            </a-radio>
        </div>
    </a-radio-group>
</template>

<script>
import {debounce} from "lodash-es";

export default {
    name: "ResultRowConfig",
    emits: ["update:modelValue"],
    props: ["modelValue"],
    data() {
        return {
            resultRow: "custom",
            resultRows: 1000
        }
    },
    created() {
        if (this.modelValue != undefined) {
            this.resultRow = this.modelValue < 0 ? "all" : "custom";
            this.resultRows = this.modelValue;
        } else {
            this.resultRow = "custom";
            this.resultRows = 1000;
            this.onChange();
        }
    },
    methods: {
        i18n(name, text, key) {
            return this.$ti18(name, text, "chartLang.common", key);
        },
        //延迟修改
        onChange: debounce(function () {
            this.$emit("update:modelValue", this.resultRow == "all" ? -1 : this.resultRows);
        }, 500),
    },
    watch: {
        resultRows: function (val) {
            this.onChange();
        }
    }
}
</script>

<style scoped>
.resultRow {
    margin-top: 10px
}
</style>
